<template>
  <el-form style="margin-top: 5px;"
    ref="adFormRef"
    class="rk-compact-form"
    :model="form"
    :rules="formRules"
    label-width="130px">
    <el-form-item label="父级区划">
      <el-input disabled
        v-model="supername" />
    </el-form-item>
    <el-form-item label="区划编码"
      prop="code">
      <el-input v-model="form.code"
        placeholder="请输入" />
    </el-form-item>
    <el-form-item label="区划名称"
      prop="name">
      <el-input v-model="form.name"
        placeholder="请输入" />
    </el-form-item>
    <el-form-item label="区划简称">
      <el-input v-model="form.alias"
        placeholder="请输入" />
    </el-form-item>
    <el-form-item label="状态"
      prop="status">
      <rk-select style="width: 100%;"
        v-model="form.status"
        :isSearch="false"
        placeholder="请选择状态"
        enum="USER_STATUS_ENUMS">
      </rk-select>
    </el-form-item>
    <el-form-item label="统计区划"
      prop="tjCode">
      <RkTreeSelect v-model="form.tjCode"
        :showCode="false"
        placeholder="请选择区划"
        :props="{ label: 'text',value: 'code' }"
        :server="{
                url: '/eleAd/tree',
                method: 'post',
                data: { code: userInfo.adCode }
              }"
        @change="handleChange">
      </RkTreeSelect>
    </el-form-item>
    <el-form-item label="行政区划">
      <el-input v-model="form.xzCode"
        placeholder="请输入" />
    </el-form-item>
    <el-form-item label="财政区划">
      <el-input v-model="form.czCode"
        placeholder="请输入" />
    </el-form-item>
    <el-form-item label="生效时间">
      <el-date-picker v-model="form.starttime"
        clearable
        placeholder="请选择时间"
        format="YYYY-MM-DD"
        value-format="YYYY-MM-DD" />
    </el-form-item>
    <el-form-item label="失效时间">
      <el-date-picker v-model="form.endtime"
        style="width: 100%;"
        placeholder="请选择时间"
        format="YYYY-MM-DD"
        value-format="YYYY-MM-DD" />
    </el-form-item>
  </el-form>
</template>

<script setup>
import XEUtils from 'xe-utils'
import { useUserStore } from '@/stores/modules';
const userInfo = useUserStore().userInfo

/** 默认表单数据 */
let adForm = reactive({
  // 区划Id
  guid: undefined,
  // 父级区划Id
  superguid: undefined,
  // 区划编码
  code: undefined,
  // 区划名称
  name: undefined,
  // 区划状态 1-启用 2-停用
  status: "1",
  // 统计区划Id
  tjGuid: undefined,
  // 统计区划编码
  tjCode: undefined,
  // 统计区划名称
  tjName: undefined,
  // 简称
  alias: undefined,
  // 财政编码
  czCode: undefined,
  // 行政区划
  xzCode: undefined,
  // 生效时间
  starttime: new Date().format('yyyy-MM-dd'),
  // 失效时间
  endtime: undefined
})
const props = defineProps({
  // 回显的表单数据
  adModel: {
    type: Object, default: () => { }
  },
  model: {
    type: String,
    default: ''
  },
})
const adFormRef = ref('')
const supername = ref('')
const treeParams = inject('treeParams')
const form = ref(XEUtils.clone(adForm, true))

onMounted(() => {
  handlerTopTreeType(treeParams)
})
const handlerTopTreeType = async (params) => {
  const { name, guid } = params
  supername.value = name
  if (props.model == 'add') {
    adForm.superguid = guid
  }
  form.value = {
    ...adForm
  }
}

const handleChange = (value, data) => {
  const { name, id } = data
  form.value.tjName = name
  form.value.tjGuid = id
}

/** 修改表单数据回显 */
const loadForm = async () => {
  const echoForm = props.adModel
  const { parentCode, parentName } = echoForm
  if (parentCode != null || parentCode != undefined) {
    supername.value = `${parentCode} ${parentName}`
  }
  let newFormData = {}
  for (let key in adForm) {
    const newKey = (XEUtils.isNull(echoForm[key]) || XEUtils.isUndefined(echoForm[key])) ? adForm[key] : echoForm[key]
    newFormData[key] = XEUtils.clone(newKey, true)

  }
  form.value = {
    ...newFormData
  }
}

const formRules = reactive({
  code: [{ required: true, message: '请输入区划编码', trigger: 'blur' }],
  name: [{ required: true, message: '请输入区划名称', trigger: 'blur' }],
  status: [{ required: true, message: '请选择状态', trigger: 'change' }],
  tjCode: [{ required: true, message: '请选择统计区划', trigger: 'change' }],
})

/** 表单校验 */
const validateForm = async () => {
  let resValid = false
  await adFormRef.value.validate((valid, failCol) => {
    resValid = valid
  })
  return resValid
}

/** 重置表单 */
const resetForm = () => {
  adFormRef.value.resetFields()
  adFormRef.value.clearValidate()
  // 重新赋值
  form.value = XEUtils.clone(adForm, true)
}
/** 请求获取信息 */
const getFormData = () => {
  const { guid } = props.adModel
  adForm.guid = guid
  let resultData = {}
  for (let key in form.value) {
    resultData[key] = Reflect.ownKeys(adForm).includes(key) ? form.value[key] : ''
  }
  return resultData
}

defineExpose({
  validateForm,
  resetForm,
  loadForm,
  getFormData
})
</script>

<style lang="less" scoped>
</style>